<!DOCTYPE html>
<html>

	<head>
		<meta http-equiv="content-type" content="text/html;charset=utf-8" />
		<title>微信安全支付</title>
		<meta name="format-detection" content="telephone=no" />
		<meta name="viewport" content="width=device-width,user-scalable=no" />
		<style type="text/css">
		body, div, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6, pre, code, form, fieldset, legend, input, textarea, p, blockquote, th, td, header, hgroup, nav, section, article, aside, footer, figure, figcaption, menu, button {
  margin: 0;
  padding: 0;
  outline: 0;
}
			h2.title {
			  padding-left: 15px;
			  line-height: 45px;
			  font-size: 16px;
			  color: #707171;
			  top: 0;
			  height: 45px;
			  -webkit-box-sizing: border-box;
			  width: 100%;
			  z-index: 10;
			  background-color: #f8f9fa;
			  background:#00bc0c;
			  color: #FFFFFF;
			}
			.ui-border-b {
			  border-bottom: 1px solid #e0e0e0;
			}
			.ui-list {
			  background-color: #fff;
			}
			.ui-border-tb {
			  border-top: #e0e0e0 1px solid;
			  border-bottom: #e0e0e0 1px solid;
			  background-image: none;
			}
			.ui-btn-lg {
			  font-size: 18px;
			  height: 44px;
			  line-height: 42px;
			  display: block;
			  width: 100%;
			  border-radius: 5px;
			}
			.ui-btn, .ui-btn-lg, .ui-btn-s {
			  height: 30px;
			  line-height: 30px;
			  padding: 0 13px;
			  min-width: 55px;
			  display: inline-block;
			  position: relative;
			  text-align: center;
			  color: #0079ff;
			  font-size: 15px;
			  background-color: #fdfdfd;
			  background-image: -webkit-gradient(linear,left top,left bottom,color-stop(0.5,#fff),to(#fafafa));
			  border-radius: 3px;
			  vertical-align: top;
			  color: #00a5e0;
			  -webkit-box-sizing: border-box;
			  border: 1px solid #cacccd;
			  -webkit-background-clip: padding-box;
			  background-clip: padding-box;
			}
			.ui-btn-danger {
			  background-color: #f75549;
			  background-image: -webkit-gradient(linear,left top,left bottom,color-stop(0.5,#fc6156),to(#f75549));
			  color: #fff;
			  border-color: #f43d30;
			  -webkit-background-clip: padding-box;
			  background-clip: padding-box;
			}
			.ui-btn-wrap {
  			padding: 20px 15px;
			}
			.ui-border-b {
  			border-bottom: 1px solid #e0e0e0;
			}
.ui-list-thumb span, .ui-list-thumb-s span, .ui-list-img span {
  width: 100%;
  height: 100%;
  -webkit-background-size: 100% 100%;
  display: block;
  position: absolute;
  left: 0;
  top: 0;
  z-index: 1;
}
			.ui-list-img {
  width: 100px;
  height: 68px;
  margin: 10px 10px 10px 0;
  position: relative;
}
.ui-list-info {
  -webkit-box-flex: 1;
  box-flex: 1;
  padding-right: 20px;
  display: box;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-box-pack: center;
}
.ui-list-link .ui-list-info, .ui-list-item-link .ui-list-info, .ui-list-text .ui-list-info {
  padding-right: 35px;
}.ui-list-info>h4 {
  font-size: 16px;
  line-height: 24px;
}
.ui-nowrap {
  max-width: 100%;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}.ui-list>li.ui-border-t:first-child {
  border: 0;
  background-image: none;
}
.ui-list>li {
  position: relative;
  display: -webkit-box;
  display: box;
  margin-left: 15px;
}
.ui-border-t {
  border-top: 1px solid #e0e0e0;
}
li {
  list-style: none;
}
.ui-nowrap {
  max-width: 100%;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}
.ui-list-info>p {
  font-size: 13px;
  line-height: 22px;
  color: gray;
}
.ui-txt-warning{
	  color: #fc4226;
}
.contactinfo .ui-list-info{
	padding:5px;
}
.ui-btn-weixin{
	background:#00bc0c;
	color: #FFFFFF;
}
#submit{
	width: 100%;
	padding: 0 13px;
	min-width: 55px;
	display: inline-block;
	position: relative;
	text-align: center;
	font-size: 15px;
	border-radius: 3px;
	vertical-align: top;
	color: #00a5e0;
	-webkit-box-sizing: border-box;
	-webkit-background-clip: padding-box;
	background-clip: padding-box;
}
		</style>
	</head>

	<body>
		<notempty name="error">
			</br>
			<p class="ui-txt-warning">{$error}</p>
		<else/>
		<div>
			<h2 class="title">联系信息</h2>
		</div>		
		<ul class="ui-list contactinfo">
			
				<li class="ui-border-t">
					<div class="ui-list-info">联系人：{$order.contactname}</div>
				</li>
				<li class="ui-border-t">
					<div class="ui-list-info">联系电话：{$order.mobile}</div>
				</li>
				<li class="ui-border-t">
					<div class="ui-list-info">联系地址：{$order.province},{$order.city},{$order.area},{$order.detailinfo}</div>
				</li>
		</ul>
		<div>
			<h2 class="title">商品清单</h2>
		</div>		
		<ul class="ui-list">
		<volist name="items" id="vo">
				<li class="ui-border-b">
		        <div class="ui-list-img">
		           <span style="background-image:url({$vo['pic']})"></span>
		        </div>
		        <div class="ui-list-info">
		            <h4>{$vo['item']}</h4>
		            <p>{$vo['price']}元 数量：{$vo['n']} </p>
		           
		        </div>
				</li>
		</volist>
				<li><span class="ui-txt-warning">订单总价：{$order.price}元</span></li>
		</ul>
		
		<div class="ui-form">
			<div class="">
				<div class="ui-btn-wrap">
					<!--<a id="submit" href="javascript:callpay();" class="ui-btn-lg ui-btn-weixin ">微信安全支付</a>-->
					<a id="submit" href="javascript:callpay();" ><img alt="微信安全支付" style="width: 160px;height: auto;" src="__IMG__/btn/weixin-pay.jpg?v=1" /></a>
				</div>
			</div>
		</div>
		<script type="text/javascript">
			 //调用微信JS api 支付
			function jsApiCall() {
				WeixinJSBridge.invoke(
					'getBrandWCPayRequest', {$jsapiparams},
					function(res) {
						if (res.err_msg == "get_brand_wcpay_request:ok") {
							window.location.href = "{:U('Shop/Orders/paysuccess')}";
						} else if (res.err_msg == "get_brand_wcpay_request:cancel") {
							alert("您取消了支付，可以在我的订单中继续支付！");
						} else if (res.err_msg == "get_brand_wcpay_request:fail") {
							alert(res.err_desc);
						}
					}
				);
			}

			function callpay() {
				if (typeof WeixinJSBridge == "undefined") {
					if (document.addEventListener) {
						document.addEventListener('WeixinJSBridgeReady', jsApiCall, false);
					} else if (document.attachEvent) {
						document.attachEvent('WeixinJSBridgeReady', jsApiCall);
						document.attachEvent('onWeixinJSBridgeReady', jsApiCall);
					}
				} else {
					jsApiCall();
				}
			}
		</script>

		</notempty>
		{__NORUNTIME__}
	</body>

</html>